<template>
  <!-- 内容管理 -->
  <div class="app-container">
    <div class="content-management">
      <div slot="header" class="clearfix">
        <ComSelect :options="options" @EventChange="changeFn"></ComSelect>
      </div>
      <div class="text item">
        <!-- <ComForm :modes="formModes" :list="listForm"></ComForm> -->
      </div>
      <div class="conform" style="margin-top: 20px">
        <ComForm
          @EventDatePicker="clearDatepickerFn"
          ref="comForm"
          @EventReset="resetFn"
          @EventOnsubmit="queryFn"
          :list="comForm"
        >
        </ComForm>
      </div>

      <ComTable
        @handleCurrentChange="pageCurrentChange"
        @handleSizeChange="pageSizeChange"
        :key="romdom"
        :list="tableList"
        :modes="tableModes"
        :config="{ border: true, loading }"
        :pagination="{ total: paging.total, pageNum: paging.pageNum }"
      >
        <el-table-column align="left" width="280" #default="{ row }">
          <el-button
            v-if="row.status == '4'"
            size="mini"
            plain
            type="primary"
            @click="downShelfFn(row)"
            v-hasPermi="['work:doc:edit']"
          >
            下架
          </el-button>
          <el-button
            size="mini"
            plain
            type="primary"
            @click="goFn(row)"
            v-hasPermi="['work:doc:getInfo']"
          >
            详细
          </el-button>
          <el-button size="mini" plain type="primary"> 数据分析 </el-button>
        </el-table-column>
      </ComTable>
    </div>
  </div>
</template>

<script>
import ComForm from "../../../components/comForm.vue";
import ComSelect from "../../../components/comSelect.vue";
import ComTable from "../../../components/comTable.vue";
import comForm from "../../../components/comForm.vue";
import { getListDataApi } from "@/wss/api/label";
import { getContentSupervisionListApi } from "@/wss/api/ContentSupervision.js";
import { getDocEditAPi } from "@/wss/api/ContentSupervision/ContentManagement.js";

export default {
  components: { ComSelect, ComForm, comForm, ComTable },

  data() {
    return {
      loading: false,
      paging: {
        pageNum: 1,
        pageSize: 10,
        status: "",
        temp: "",
      },
      // 修复切换”审核不会更新bug“
      romdom: "",
      currentSelect: "edit",
      currentShowText: {
        first: "查看",
        second: "删除",
      },
      // 快速筛选
      options: {
        value: "",
        title: "快速筛选",
        list: [
          {
            value: "",
            label: "全部",
          },
          {
            value: "4",
            label: "上架",
          },
          {
            value: "5",
            label: "已下架",
          },

          {
            value: "6",
            label: "客户未公开",
          },

          {
            value: "7",
            label: "法规更新内容",
          },
        ],
      },

      // 表格的数据
      tableList: [],
      tableModes: [
        {
          type: "selection",
        },
        {
          label: "内容编号",
          mode: "no",
        },
        {
          label: "内容类型",
          mode: "type",
          width: "100",
          align: "center",
        },
        {
          label: "内容标题",
          mode: "title",
          showOverflowTooltip: true,
        },
        {
          label: "内容标签",
          mode: "label",
          showOverflowTooltip: true,
        },
        {
          label: "内容性质",
          mode: "makeType",
          align: "center",
          isShowTag: true,
          options: [
            {
              l: "全部",
              v: "",
            },
            {
              l: "内容产出",
              v: 0,
            },
            {
              l: "用户内容公开",
              v: 1,
            },
          ],
        },
        {
          label: "状态",
          mode: "status",
          align: "center",
          isShowTag: true,
          options: [
            {
              l: "待编辑",
              v: 0,
            },
            {
              l: "审核失败",
              v: 2,
              type: "danger",
            },
            {
              l: "审核中",
              v: 1,
              type: "warning",
            },
            {
              l: "成功",
              v: 3,
            },
            {
              l: "上架",
              v: 4,
            },
            {
              l: "下架",
              type: "info",
              v: 5,
            },
          ],
        },
        {
          label: "创建日期",
          mode: "createdTime",
        },
        {
          label: "状态",
          mode: "status",
          width: 100,
          align: "center",
          isShowTag: true,
        },
      ],
      // 筛选条件
      comForm: {
        modes: [
          {
            placeholder: "请输入内容编号",
            formType: "input",
            label: "内容编号",
            mode: "no",
            value: "",
          },
          {
            placeholder: "请输入内容标题",
            formType: "input",
            label: "内容标题",
            mode: "title",
            value: "",
          },
          {
            placeholder: "",
            formType: "select",
            mode: "type",
            label: "内容类型",
            value: "",
            select: [],
          },
          {
            placeholder: "",
            formType: "select",
            label: "内容标签",
            mode: "labelId",
            value: "",
            select: [],
          },
          {
            placeholder: "",
            formType: "select",
            label: "内容性质",
            mode: "makeType",
            value: "",
            select: [],
          },
          {
            pickerType: "daterange",
            formType: "datePicker",
            mode: "temp",
            label: "上架时间",
            value: "2021-10-9",
            startPlaceholder: "开始日期",
            endPlaceholder: "结束日期",
          },
        ],
      },
      // 动态生成下拉列表的筛选条件
      dynamicFilter: {},
    };
  },
  mounted() {
    this.getContentSupervisionListFn();
    this.getLabelFn();
  },
  methods: {
    async getLabelFn() {
      let { rows } = await getListDataApi();
      console.log(rows, "rows");
      this.comForm.modes.forEach((item) => {
        if (item.mode === "labelId") {
          item.select = rows.map((item) => {
            return { label: item.content, value: item.idStr };
          });
        }
      });
    },
    // 清空筛选条件时候
    clearDatepickerFn() {
      this.paging.temp = "";
      // 后端需要的是null
      this.paging.beginTime = null;
      this.paging.endTime = null;
    },
    // 数据转换成对象
    arrTransformObj(data) {
      return data.map((item) => {
        return { value: item };
      });
    },
    // 下架
    downShelfFn(row) {
      this.$confirm("此操作将永久下架, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          getDocEditAPi({ id: row.idStr, status: "5" });
          this.getContentSupervisionListFn();
          this.$message({
            type: "success",
            message: "下架成功!",
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消下架",
          });
        });
    },
    // 详细路由跳转函数
    goFn(row) {
      console.log(row, "详细路由跳转数据");

      if (row.type === "问答") {
        this.$router.push({
          path: "/contentPlatform/askAnswer/askAnswer-details",
          query: { esId: row.esId },
        });
      } else if (row.type === "法条" || row.type === "法规") {
        this.$router.push({
          path: "/contentPlatform/laws/laws-details",
          query: { esId: row.esId },
        });
      } else if (row.type === "政策" || row.type === "文章") {
        this.$router.push({
          path: "/contentPlatform/article/article-details",
          query: { esId: row.esId },
        });
      } else if (row.type === "头条") {
        this.$router.push({
          path: "/contentPlatform/headline/headline-details",
          query: { esId: row.esId },
        });
      }
    },
    resetFn() {
      this.romdom = Math.random();
      this.options.value = "";
      this.paging.status = "";
    },
    // 当前页发生变化
    pageCurrentChange(pageNum) {
      this.paging.pageNum = pageNum;
      this.getContentSupervisionListFn();
    },
    // 页容量发生变化
    pageSizeChange(pagesize) {
      this.paging.pageSize = pagesize;
      this.paging.pageNum = 1;
      this.getContentSupervisionListFn();
    },
    async getContentSupervisionListFn() {
      this.loading = true;
      let { rows, code, total } = await getContentSupervisionListApi(
        this.paging
      );

      if (code === 200) {
        this.paging.total = total;
        this.tableList = rows;
        this.tableList.forEach((item) => {
          // 是否有这个属性
          this.dynamicFilter.makeType ? "" : (this.dynamicFilter.makeType = []);
          this.dynamicFilter.label ? "" : (this.dynamicFilter.label = []);
          this.dynamicFilter.type ? "" : (this.dynamicFilter.type = []);

          if (!this.dynamicFilter.makeType.includes(item.makeType)) {
            this.dynamicFilter.makeType.push(item.makeType);
          }

          if (!this.dynamicFilter.type.includes(item.type)) {
            this.dynamicFilter.type.push(item.type);
          }
          if (!this.dynamicFilter.label.includes(item.label)) {
            this.dynamicFilter.label.push(item.label);
          }
        });
        // 动态生成筛选下拉列表
        this.comForm.modes.forEach((item) => {
          switch (item.mode) {
            case "type":
              item.select = this.arrTransformObj(this.dynamicFilter.type);
              break;
            case "makeType":
              item.select = this.arrTransformObj(this.dynamicFilter.makeType);
              // 生成筛选中文
              item.select.forEach((item) => {
                console.log(item);
                item.value === null ? (item.label = "全部") : "";
                item.value === "0" ? (item.label = "内容产出") : "";
                item.value === "1" ? (item.label = "用户内容公开") : "";
              });
              break;
            default:
              break;
          }
        });
      }
      this.loading = false;
      // newData.forEach((item) => {
      //   if (item.status === "0") {
      //     item.status = "上架";
      //   }
      //   if (item.makeType === "1") {
      //     item.status = "在售中";
      //   }
      //   if (item.makeType === "2") {
      //     item.status = "已下架";
      //   }
      //   if (item.makeType === "3") {
      //     item.status = "客户未公开内容";
      //   }
      //   if (item.makeType === "4") {
      //     item.status = "法规更新异常内容";
      //   }
      // });
    },
    // 查询
    queryFn(arr) {
      arr.forEach((item) => {
        for (const key in item) {
          this.paging[key] = item[key];
        }
      });
      if (this.paging["temp"] instanceof Array) {
        // 不需要秒数
        this.paging["beginTime"] = this.paging["temp"][0].split(" ")[0];
        this.paging["endTime"] = this.paging["temp"][1].split(" ")[0];
        this.paging["temp"] = "";
      }
      this.paging.pageNum = 1;
      this.getContentSupervisionListFn();
    },
    GotoDetailFn() {
      this.$router.push({
        path: "/contentPlatform/askAnswer/askAnswer-details",
      });
    },
    changeFn(value) {
      this.paging.status = value;
      // 每次快熟筛选更新就清空筛选字段
      this.$refs.comForm.resetFn();
      this.options.value = value;
      this.currentSelect = value;
      this.paging = {
        pageNum: 1,
        pageSize: 10,
        status: "",
        total: 10,
      };
      this.paging.status = value;
      this.getContentSupervisionListFn();
      // 为成功时，多添加一个筛选字段。

      // if (value === "succeed") {
      //   this.comForm.modes.splice(2, 0, {
      //     formType: "select",
      //     label: "内容标签",
      //     select: [
      //       {
      //         label: "全部",
      //         value: "all",
      //       },
      //       {
      //         label: "一路一带",
      //         value: "AlongTheWay",
      //       },
      //       {
      //         label: "合同纠纷",
      //         value: "contractDispute",
      //       },
      //     ],
      //   });
      // } else {
      //   if (this.comForm.modes[2].label === "内容标签") {
      //     this.comForm.modes.splice(2, 1);
      //   }
      // }
      // 修复切换”审核不会更新bug“
      this.romdom = Math.random();
    },
  },
};
</script>

<style lang ="scss" scoped>
</style>